<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:p="http://primefaces.org/ui">

	<p:dialog header="Detail de la cliente"
		widgetVar="detailClienteDialog" resizable="false" width="770"
		showEffect="clip" hideEffect="clip">
		<h:panelGrid id="detail" columns="3" cellpadding="1">
			<h:panelGrid columns="2" cellpadding="1" width="250">
				<h:outputText value="Nom" />
				<h:outputText style="font-weight:bold" value="#{cliente.nom}" />

				<h:outputText value="Prenom" />
				<h:outputText style="font-weight:bold" value="#{cliente.prenom}" />

				<h:outputText value="Adresse" />
				<h:outputText style="font-weight:bold" value="#{cliente.adresse.nomDeRue}" />

				<h:outputText value="Ville" />
				<h:outputText  style="font-weight:bold" value="#{cliente.adresse.codePostal} #{cliente.adresse.ville}" />
				
				<h:outputText value="Email" />
				<h:outputText style="font-weight:bold" value="#{cliente.adresse.email}" />
					
				<h:outputText value="Tel. fixe" />
				<h:outputText style="font-weight:bold" value="#{cliente.adresse.telDomicile}" />

				<h:outputText value="Tel. portable" />
				<h:outputText style="font-weight:bold" value="#{cliente.adresse.telPortable}" />
				
				<h:outputText value="Date de naissance" />
				<h:outputText style="font-weight:bold" value="#{cliente.dateDeNaissance}">
					<f:convertDateTime timeZone="GMT+3" pattern="dd/MM/yyyy" />
				</h:outputText>
				
				<h:outputText value="Derniere visite" />
				<h:outputText style="font-weight:bold" value="#{cliente.derniereVisite}">
					<f:convertDateTime timeZone="GMT+3" pattern="dd/MM/yyyy" />
				</h:outputText>
				
			</h:panelGrid>
			
			<h:panelGrid columns="2" cellpadding="1" width="250">
				
				<h:outputText value="Hotesse" />
				<h:outputText style="font-weight:bold" value="#{cliente.hotesse}" />
				
				<h:outputText value="Individuelle" />
				<h:outputText style="font-weight:bold" value="#{cliente.individuelle  ? 'Oui' : 'Non'}" />
				
				<h:outputText value="Taille haut" />
				<h:outputText style="font-weight:bold" value="#{cliente.tailleHaut.nom}" />
				
				<h:outputText value="Taille bas" />
				<h:outputText style="font-weight:bold" value="#{cliente.tailleBas.nom}" />
				
				<h:outputText value="Preferences" />
				<p:scrollPanel style="width:140px;height:44px">
					<h:outputText value="#{cliente.preferences}" />
				</p:scrollPanel>
				
				<h:outputText value="Commentaires" />
				<p:scrollPanel style="width:140px;height:44px">
					<h:outputText value="#{cliente.commentaires}" />
				</p:scrollPanel>
				
			</h:panelGrid>

			<h:panelGrid columns="2" cellpadding="1" width="250">
				<h:outputText value="Achats" />
				<p:scrollPanel style="width:140px;height:60px">
					<h:outputText value="#{cliente.achats}" />
				</p:scrollPanel>
				
				<h:outputText value="Produits" />
				<p:scrollPanel style="width:140px;height:110px">
					<h:outputText value="#{fn:length(cliente.produits)} produit(s)" />
				</p:scrollPanel>
			</h:panelGrid>
		</h:panelGrid>
		<p:panel style="text-align:center">
			<h:commandButton action="#{backBean.modifierCliente}" value="Modifier"/>
			<h:commandButton id="showDialogButton" value="Supprimer" onclick="confirmation.show()" type="button" />
		</p:panel>
	</p:dialog>
	
	<p:confirmDialog id="confirmDialog" appendToBody="true" message="Voulez vous supprimez cette cliente ?" header="Suppression" severity="alert" widgetVar="confirmation">  
        <p:commandButton id="confirm" value="Oui" oncomplete="confirmation.hide()" action="#{backBean.supprimerCliente}" />  
        <p:commandButton id="decline" value="Non" onclick="confirmation.hide()" type="button" />   
    </p:confirmDialog>
    
</ui:composition>